<template>
    <div>
        <div v-for="(i,index) in bannerList">
            <!-- <el-carousel :height="height + 'px'"> -->
            <!-- <el-carousel-item > -->
            <img  :style="{height:height + 'px'}"  v-if="typeId == i.id && i.image" :src="baseUrl + i.image" width="100%" height="100%" />
            <!-- </el-carousel-item> -->
            <!-- </el-carousel> -->
        </div>
    </div>
</template>

<script>
    import {
        category_image
    } from "@/utils/home/index.js";
    export default {
        data() {
            return {
                height: 640, // 轮播图高度
                baseUrl: process.env.VUE_APP_BASE_API,
                bannerList: [],
            };
        },
        props: {
            // 类型
            typeId: {
                type: Number,
                default: 1,
            },
        },
        created() {
            this.getList();
        },
        mounted() {
            this.handleResize();
            window.addEventListener("resize", this.handleResize);
        },

        methods: {
            getList() {
                let that = this
                category_image().then((response) => {
                    that.bannerList = response.data.list
                });
            },
            // 自适应banner图高度
            handleResize() {
                this.height = document.body.clientWidth / 3;
            },
        },
    };
</script>

<style lang="scss" scoped></style>